<!DOCTYPE html>
<html>
<body>
<div style="position: fixed;top: 30px;right: 100px;">
    <input style="color: red;" type="button" value="STOP!" onclick="stopWebsocket()">
</div>
<div id="logContainer" style="height: 100%; overflow-y: auto;"></div>
<!--<script src="https://cdn.bootcdn.net/ajax/libs/sockjs-client/1.6.1/sockjs.min.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/stomp.js/2.3.3/stomp.min.js"></script>-->
<script src="./js/sockjs.min.js"></script>
<script src="./js/stomp.min.js"></script>
<script>
    const socket = new SockJS('/ws-log');
    const stompClient = Stomp.over(socket);

    stompClient.connect({}, (frame) => {
        stompClient.subscribe('/topic/logs', (message) => {
            const logEntry = document.createElement('div');
            logEntry.textContent = message.body;
            document.getElementById('logContainer').appendChild(logEntry);
            //logContainer.scrollTop = logContainer.scrollHeight;
        });
    });

    function stopWebsocket() {
        console.log("stop")
        socket.close(1000, 'Normal Closure');
    }
</script>
</body>
</html>
